import { Layout, Menu, Icon } from 'antd';
import React, { Component } from "react";
import "./App.css";
import Appsider from './components/sider';
import Appheader from './components/header';
import Mylist from './pages/List';
import store from './redux/index';
// import "antd/dist/antd.css";

const { Header, Sider, Content,Footer } = Layout;

class Demo extends Component {

  constructor(props){
    super(props);
    this.state = store.getState();
    this.storeChange = this.storeChange.bind(this)
    store.subscribe(this.storeChange);
  }

  storeChange(){
    this.setState(store.getState())
  }

  render(){
    return(
      <div className="test">
        <Layout>
          <Sider collapsed={this.state.collapsed}>
            <Appsider/>
          </Sider>
          <Layout>
            <Header style={{background:'#fff',height:'100px',padding:'0 0px'}}><Appheader /></Header>
            <Content><Mylist /></Content>
            <Footer>Footer</Footer>
          </Layout>
        </Layout>
      </div>
    )
  }
}

export default Demo;